<template>
  <view class="container">
    <view class="base">
      <view class="list">
        <view class="list_left">
          <view>姓名</view>
        </view>
        <view class="list_right">
          <view>{{ info.nickName }}</view>
        </view>
      </view>
      <view class="list">
        <view class="list_left">
          <view>性别</view>
        </view>
        <view class="list_right">
          <view>{{ info.sex == 1 ? '女' : '男' }}</view>
        </view>
      </view>
      <view class="list">
        <view class="list_left">
          <view>部门</view>
        </view>
        <view class="list_right">
          <view>{{ info.dept ? info.dept.deptName : '' }}</view>
        </view>
      </view>
      <view class="list">
        <view class="list_left">
          <view>手机号</view>
        </view>
        <view class="list_right">
          <view>{{ info.phonenumber }}</view>
        </view>
      </view>
      <view class="list">
        <view class="list_left">
          <view>登录帐号</view>
        </view>
        <view class="list_right">
          <view>{{ info.userName }}</view>
        </view>
      </view>
      <view class="list">
        <view class="list_left">
          <view>角色权限</view>
        </view>
        <view class="list_right">
          <view>{{ roleGroup }}</view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        info: {},
        roleGroup: '',
      }
    },
    onLoad(options) {
      this.getinfo()
    },
    methods: {
      getinfo() {
        this.$request.getuserprofile().then(res => {
          this.info = res.data || {}
          this.roleGroup = res.roleGroup || ''
        })
      },
    },
  }
</script>

<style lang="scss" scoped>
  .base {
    width: 100%;
    border-top: 1px solid #e9e7e7;

    .list {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 20rpx 25rpx;
      border-bottom: 1px solid #e9e7e7;
      font-size: 30rpx;
      line-height: 60rpx;
      color: #7b7b7b;

      .list_left {}

      .list_right {
        width: 60%;
        text-align: right;
      }
    }
  }
</style>
